<script setup lang="ts">
import { ref } from 'vue'

const username = ref('')
const password = ref('')

// 绑定的选择框 布尔值
const isShow = ref(false)

// 判断是否是 勾选状态
const login = () => {
if(isShow.value){
  console.log(username.value, password.value)
}else{
alert('勾选~')
}
}

const reset = () => {
  username.value = ''
  password.value = ''
}

</script>


<template>
  <div id="app">
    账户：<input v-model="username" type="text"> <br><br>
    密码：<input v-model="password" type="password"> <br><br>
  <input v-model="isShow" type="checkbox">
    <button @click="login">登录</button>
    <button @click="reset">重置</button>
  </div>
</template>

<style></style>